<section class="panel-body">
    <header class="panel-head" style="line-height: 50px;word-break:break-all;">
                            <span class="detail-head-file-name" >
	                            <i class="fa" class="main-color" ng-class="{'fa-home':choseFile.isRoot(),'fa-file-text-o':choseFile.isDocument(), 'fa-folder': !choseFile.isRoot() && !choseFile.isDocument()}"></i>
                                {{choseFile.name}}
                            </span>
                            <span class="tools pull-right visible-sm visible-xs">
                                <a style="color: #00A8B3;" class="fa fa-times " ng-click="closeFile()"></a>
                            </span>
    </header>
    <div class="doc-det-act" style="display: block;">
        <header class="panel-head">
            <ul class="nav nav-justified ">
                <li ng-class="{'active':choseFile.selectTab == 'details'}">
                    <a ng-click="choseFile.changeTab('details')">
                        {{'details' | translate }}
                    </a>
                </li>
                <li class="hide-c1 hide-platform-pad" ng-class="{'active':choseFile.selectTab == 'activity','hide':device=='phantom-online'}">
                    <a ng-click="choseFile.changeTab('activity')">
                        {{'activity' | translate }}
                    </a>
                </li>
                <li ng-class="{'active':choseFile.selectTab == 'comment','hide':device=='phantom-online'}" class="hide-c1 hide-platform-pad" ng-if="choseFile.isRoot() || choseFile.isDocument()">
                    <a ng-click="choseFile.changeTab('comment')">
                        Comment
                    </a>
                </li>
            </ul>
        </header>
        <div class="panel-body">
            <div class="tab-content tasi-tab">
                <div class="tab-pane" id="details" ng-class="{'active':choseFile.selectTab == 'details'}">
                    <div class="text-center padding-30px" ng-if="supportFile">
                        <!--<p ng-if="choseFile.thumbImg === null">{{'loading' | translate }}</p>-->
                        <div class="spinner1" ng-if="!choseFile.thumbImgLoaded && choseFile.thumbImg!==''">
                            <div class="bounce1"></div>
                            <div class="bounce2"></div>
                            <div class="bounce3"></div>
                        </div>
                        <p ng-if="choseFile.thumbImg === false && choseFile.thumbImgBig === false"><a ng-click="choseFile.getRenditions(null,null,true)">{{'thumb_error' | translate }}</a></p>
                        <!-- thumbImg 为空 那么 thumbImgBig 肯定为空-->
                        <a ng-click="preview(choseFile)" class="border-1px" ng-class="{'hide':!choseFile.thumbImgLoaded && choseFile.thumbImgBig!=='' || !choseFile.thumbImgLoaded && choseFile.thumbImg!=='' ,'':choseFile.thumbImgLoaded||choseFile.thumbImgBig===''}">
                            <i style="font-size: 48px" class="fa fa-file-text-o" ng-if="choseFile.thumbImg===''"></i>
                            <img data-id="{{ choseFile.id }}" image-loaded-end ng-src="{{ choseFile.thumbImgBig || choseFile.thumbImg  }}" ng-if="choseFile.thumbImgBig || choseFile.thumbImg"/>
                        </a>
                        <div ng-if="choseFile.isRoot()">{{choseFile.protectionLevel | LevelFilter}}</div>
                    </div>
                    <!--<div class="bor-bottom panel" ng-class="{'hide':device=='phantom-online' || device=='reader-online'}" ng-if="choseFile.isRoot() && showMembers">-->
                        <!--<h3>-->
                            <!--<ul class="list-inline n-m user_wrap">-->
                                <!--<li ng-class="{'bor-right':$index != choseFile.aces.length-1}" ng-repeat="ace in choseFile.aces">-->
                                    <!--<img ng-src="{{ace.user.getAvatar()}}" uib-tooltip="{{ace.user.getName()}}" class="user_head"/>-->
                                <!--</li>-->
                            <!--</ul>-->
                        <!--</h3>-->
                    <!--</div>-->
                    <div class="bor-bottom attr-box hide-c1 clearfix" ng-class="{'hide':device=='phantom-online'}" ng-if="choseFile.isRoot() && device!='platform-pad'" style="padding-top:
                     10px;padding-bottom: 20px;">
                        <h4 style="color:#00A8B3;display: inline-block;margin-bottom: 0;"><i class="fa fa-user fa-fw"></i> My Membership Type</h4>
                        <span class="label label-default pull-right" style="margin-top: 10px;font-size:14px;background-color: #00A8B3">{{ membershipType }}</span>
                    </div>
                    <div class="bor-bottom panel hide-c1" ng-class="{'hide':device=='phantom-online'}" ng-if="choseFile.isRoot() && device!='platform-pad'">
                        <h4 style="color:#00A8B3;"><i class="fa fa-link fa-fw"></i> Link to This Room</h4>
                        <div class="input-group m-b-10">
                            <input id="short-link-clipboard" type="text" class="form-control" value="{{roomLink}}" readonly>
											<span class="input-group-btn">
												<button class="btn btn-default" type="button" uib-tooltip="Copy to Clipboard" ngclipboard data-clipboard-target="#short-link-clipboard"><i class="fa fa-clipboard"></i></button>
											</span>
                        </div>
                    </div>

                    <div class="bor-bottom attr-box">
                        <div class="panel border-none">
                            <div class="panel-heading text-center panel-heading-ex">{{choseFile.name}}</div>
                            <div class="panel-body text-center" style="padding:0">
                                <div class="row text-left">
                                    <div class="col-sm-12" style="padding:0">
                                        <div class="thumbnail thumbnail-ex">
                                            <!--<img style="width:25%" class="img-circle hide-c1" ng-src="{{choseFile.createdBy.getAvatar()}}" alt="">-->
                                            <table class="table file-date">
                                                <tbody>
                                                    <tr class="hide-c1">
                                                        <td class="long-words-handle font-size-14px">{{'create_by' | translate }}:</td>
                                                        <td>
                                                            <span class="long-words-handle hide-c1">{{choseFile.createdBy.getName()}}</span>
                                                        </td>
                                                    </tr>
                                                    <tr>
                                                        <td class="long-words-handle font-size-14px">{{'creation_date' | translate }}:</td>
                                                        <td class="long-words-handle font-size-14px">
                                                            <span class="long-words-handle" ng-if="lang!='DK'">{{choseFile.creationDate | date:'yyyy/MM/dd' }}</span>
                                                            <span class="long-words-handle" ng-if="lang=='DK'">{{choseFile.creationDate | date:'dd,MMM,yyyy' | lowercase }}</span>
                                                        </td>
                                                    </tr>
                                                    <tr class="hide-c1">
                                                        <td class="long-words-handle font-size-14px hide-c1">{{'last_modified_by' | translate }}:</td>
                                                        <td>
                                                            <span class="long-words-handle hide-c1">{{choseFile.lastModifiedBy.getName()}}</span>
                                                        </td>
                                                    </tr>
                                                    <tr>
                                                        <td class="long-words-handle font-size-14px">{{'last_modification_date' | translate }}:</td>
                                                        <td class="long-words-handle font-size-14px">
                                                            <span class="long-words-handle" ng-if="lang!='DK'">{{choseFile.lastModificationDate | date:'yyyy/MM/dd' }}</span>
                                                            <span class="long-words-handle" ng-if="lang=='DK'">{{choseFile.lastModificationDate | date:'dd,MMM,yyyy' | lowercase }}</span>
                                                        </td>
                                                    </tr>
                                                </tbody>

                                            </table>
                                            <!--<h4 class="long-words-handle font-size-14px hide-c1">{{'create_by' | translate }}:-->
                                                <!--<span class="long-words-handle hide-c1">{{choseFile.createdBy.getName()}}</span>-->
                                            <!--</h4>-->
                                            <!--<h4 class="long-words-handle font-size-14px">{{'creation_date' | translate }}:-->
                                                <!--<span class="long-words-handle" ng-if="lang!='DK'">{{choseFile.creationDate | date:'yyyy/MM/dd' }}</span>-->
                                                <!--<span class="long-words-handle" ng-if="lang=='DK'">{{choseFile.creationDate | date:'dd,MMM,yyyy' | lowercase }}</span>-->
                                            <!--</h4>-->
                                            <!--<h4 class="long-words-handle font-size-14px hide-c1">{{'last_modified_by' | translate }}:-->
                                                <!--<span class="long-words-handle hide-c1">{{choseFile.lastModifiedBy.getName()}}</span>-->
                                            <!--</h4>-->
                                            <!--<h4 class="long-words-handle font-size-14px">{{'last_modification_date' | translate }}:-->
                                                <!--<span class="long-words-handle" ng-if="lang!='DK'">{{choseFile.lastModificationDate | date:'yyyy/MM/dd' }}</span>-->
                                                <!--<span class="long-words-handle" ng-if="lang=='DK'">{{choseFile.lastModificationDate | date:'dd,MMM,yyyy' | lowercase }}</span>-->
                                            <!--</h4>-->
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    </div>
                    <div class="bor-bottom attr-box" ng-if="choseFile.description" style="margin-top: 20px;">


                        <div class="panel border-none">
                            <h3>{{ 'shared_link' | translate }} :</h3>
                            <div class="panel-body text-center" style="padding:0">
                                <div class="row">
                                    <div class="col-sm-12 " style="padding:0;">
                                        <input type="text" class="form-control" readonly="readonly" auto-select-all style="width:100%;" value="{{ choseFile.sharedLink }}">
                                    </div>
                                </div>
                                <!--<div class="row" style="padding: 10px;background: #fbfbfb;border: 1px solid #e5e5e5;border-top: none;">-->
                                    <!--<div ng-if="choseFile.description" qrcode class="qr-container" data-url="{{ choseFile.sharedLink }}"></div>-->
                                <!--</div>-->
                            </div>
                        </div>
                    </div>
                    <div class="message-to-member" ng-class="{'hide':device=='phantom-online'}"  ng-if="choseFile.isRoot() && messageToMember">
                        <h4 style="color:#00A8B3;"><i class="fa fa-sticky-note fa-fw"></i> Message from the owner</h4>
                        <div class="content" ng-bind-html="messageToMember"></div>
                    </div>
                    <div ng-show="choseFile.isDocument()" ng-include="templatePath + 'version-tpl.html'"></div>
                </div>

                <!--<div class="tab-pane hide" id="activity" class="hide-platform-pad" ng-class="{'active':choseFile.selectTab == 'activity'}">-->
                    <!--&lt;!&ndash;<div ng-if="choseFile.activities == null">{{'loading' | translate }}</div>&ndash;&gt;-->
                    <!--&lt;!&ndash;<div ng-if="choseFile.activities.length == 0">{{'no_activity' | translate }}</div>&ndash;&gt;-->
                    <!--&lt;!&ndash;<h5>Today</h5>&ndash;&gt;-->
                    <!--<div class="col-sm-12" infinite-scroll='loadMoreActivities()' infinite-scroll-distance='0' infinite-scroll-container="commentContainer">-->
                        <!--<section class="panel bor_shaw_fresh panel-body" ng-click="refreshActivity()">-->
                            <!--<div class="text-center">-->
                                <!--<i class="fa " ng-class="{'fa-refresh':choseFile.activitiesOnLoading == false,'fa-spinner fa-pulse':choseFile.activitiesOnLoading == true}"></i>-->
                                <!--&lt;!&ndash;<i class="fa fa-spinner fa-pulse" ng-if="choseFile.activitiesOnLoading"></i>&ndash;&gt;-->
                            <!--</div>-->
                        <!--</section>-->
                        <!--<section class="panel bor_shaw panel-body fadeInUp" ng-repeat="activity in choseFile.activities">-->
                            <!--<div class="col-xs-3">-->
                                <!--<img ng-src="{{activity.user.getAvatar()}}" uib-tooltip="{{activity.user.getName()}}" class="user_head"/>-->
                            <!--</div>-->
                            <!--<div class="col-xs-9">-->
                                <!--<div class="">-->
                                    <!--&lt;!&ndash;<h6>{{activity.content}}</h6>&ndash;&gt;-->
                                    <!--<h6>{{activity.create_time}}</h6>-->
                                <!--</div>-->
                                <!--<div class="menu_list break-word">-->
                                    <!--<div class="p-top-bot" ng-if="activity.getObjId()">-->
                                        <!--<a ng-click="chooseFileById(activity.getObjId())">{{activity.content}}</a>-->
                                    <!--</div>-->
                                    <!--<div class="p-top-bot" ng-if="!activity.getObjId()">-->
                                        <!--{{activity.content}}-->
                                    <!--</div>-->
                                <!--</div>-->
                            <!--</div>-->
                        <!--</section>-->
                        <!--<div class="panel  panel-body" ng-if="choseFile.activitiesOnLoading">-->
                            <!--<div class="row">-->
                                <!--<p class="text-center"><i class="fa fa-spinner fa-pulse"></i></p>-->
                            <!--</div>-->
                        <!--</div>-->
                        <!--<div class="panel bor_shaw panel-body" ng-if="choseFile.noMoreActivities && !choseFile.activitiesOnLoading">-->
                            <!--<div class="row">-->
                                <!--<p class="text-center">No More Activities</p>-->
                            <!--</div>-->
                        <!--</div>-->
                    <!--</div>-->
                    <!--&lt;!&ndash;<h5>No recorded activity before Nov 12.2011</h5>&ndash;&gt;-->
                <!--</div>-->

                <!--<div class="tab-pane hide" id="comment" class="hide-platform-pad" ng-class="{'active':choseFile.selectTab == 'comment'}" >-->

                    <!--<div class="panel-heading row po-re" style="padding-left:0;padding-right:0;border-bottom: 1px solid #cccccc;">-->
                        <!--<form novalidate role="form" name="commentForm">-->
                            <!--<div class="col-xs-12 form-group">-->
                                <!--<textarea class="form-control resize-no" id="ccomment" name="comment" rows="3" style="border-color: #00A8B3" required ng-model="commentContent"></textarea>-->
                                <!--&lt;!&ndash;<div class="pull-right text-right comment-send" style="position: absolute;bottom: 0;right: 0;">&ndash;&gt;-->
                                <!--&lt;!&ndash;<button class="btn btn-right-aside btn-sm">Add Comment</button>&ndash;&gt;-->
                                <!--&lt;!&ndash;</div>&ndash;&gt;-->
                            <!--</div>-->
                            <!--<div class="pull-right" style=>-->
                                <!--<button class="btn btn-right-aside btn-sm" ng-disabled="commentForm.comment.$invalid || commentForm.comment.$pristine" ng-click="postComment(commentContent)">Add Comment</button>-->
                            <!--</div>-->
                        <!--</form>-->
                    <!--</div>-->
                    <!--<div class="row text-left"  style="border: 1px solid #00A8B3;border-radius: 3px;margin-top:20px;" id="container" >-->
                        <!--&lt;!&ndash;&lt;!&ndash; 共多少 评论&ndash;&gt;&ndash;&gt;-->
                        <!--&lt;!&ndash;<div class="pull-left" style="margin-left:20px;">&ndash;&gt;-->
                        <!--&lt;!&ndash;<h3>Comments({{choseFile.comments.length}})</h3>&ndash;&gt;-->
                        <!--&lt;!&ndash;</div>&ndash;&gt;-->
                        <!--&lt;!&ndash; 刷新按钮&ndash;&gt;-->
                        <!--<div class="refresh-btn" ng-click="refreshComment(choseFile)">-->
                            <!--<div class="triangle"></div>-->
                                            <!--<span  style="color: white;display: inline-block;margin: 7px 0 0 27px;">-->
                                                <!--<i class="fa " ng-class="{'fa-refresh':choseFile.commentsOnLoading == false,'fa-spinner fa-pulse':choseFile.commentsOnLoading == true}"></i>-->
                                                <!--&lt;!&ndash;<i class="fa fa-spinner fa-pulse" ng-if="choseFile.commentsOnLoading"></i>&ndash;&gt;-->
                                            <!--</span>-->
                        <!--</div>-->
                        <!--&lt;!&ndash;<div class="m-top-bot col-sm-12" ng-if="choseFile.comments.length==0">&ndash;&gt;-->
                        <!--&lt;!&ndash;<div class="row text-center">&ndash;&gt;-->
                        <!--&lt;!&ndash;<h4>No Comments Here</h4>&ndash;&gt;-->
                        <!--&lt;!&ndash;</div>&ndash;&gt;-->
                        <!--&lt;!&ndash;</div>&ndash;&gt;-->
                        <!--&lt;!&ndash; 以下为评论区&ndash;&gt;-->
                        <!--<div class="col-sm-12" infinite-scroll='loadMoreComments()' infinite-scroll-distance='0' style="margin-top: -40px;" infinite-scroll-container="commentContainer">-->
                            <!--<div class="m-top-bot col-sm-12 fadeInUp" ng-repeat="comment in choseFile.comments">-->
                                <!--<div class="row">-->
                                    <!--<div class="col-xs-3 text-center">-->
                                        <!--<img class="user_head" ng-src="{{comment.user.getAvatar()}}"/>-->
                                    <!--</div>-->
                                    <!--<div class="col-xs-9" style="padding-right:60px;">-->
                                        <!--<p class="break-word m-top" style=""><span class="comment-username" style="">{{comment.user.getName()}}</span><span class="comment-time">{{comment.create_time | date:'y-M-d h:m:s'}}</span></p>-->
                                        <!--<p class="comment-content break-word">{{comment.content}}</p>-->
                                    <!--</div>-->
                                <!--</div>-->
                            <!--</div>-->
                            <!--<div class="m-top-bot-fresh-sign col-sm-12" ng-if="choseFile.commentsOnLoading">-->
                                <!--<div class="row">-->
                                    <!--<p class="text-center"><i class="fa fa-spinner fa-pulse"></i></p>-->
                                <!--</div>-->
                            <!--</div>-->
                            <!--<div class="m-top-bot col-sm-12" ng-if="choseFile.noMoreComments && !choseFile.commentsOnLoading">-->
                                <!--<div class="row">-->
                                    <!--<p class="text-center">No More Comments</p>-->
                                <!--</div>-->
                            <!--</div>-->
                        <!--</div>-->
                    <!--</div>-->
                <!--</div>-->
            </div>
        </div>
    </div>
</section>